<style lang="less">
  @import '../../styles/common.less';
</style>

<template>
  <div>
    <Button type="primary" size="large" @click="add">添加学生</Button>
    <Table border :columns="columns" :data="data"></Table>
  </div>
</template>

<script>
  import moment from 'moment'
    export default {
      name: "stdinfo",
      data(){
        return{
          columns: [
            {
              title: '编号',
              key: 'id'
            },
            {
              title: '学生姓名',
              key: 'stduentName'
            },
            {
              title: '学生学号',
              key: 'stduentNo'
            },
            {
              title: '学生性别',
              key: 'stduentSex'
            },
            {
              title: '学生手机号',
              key: 'stduentPhone'
            },
            {
              title: '学生身份证',
              key: 'stduentIdCard'
            },
            {
              title: '学生所在班级',
              key: 'stduentClass'
            },
            {
              title: '学生所在院系',
              key: 'stduentCollege'
            },
            {
              title: '创建时间',
              key: 'createTime',
              render:function (h,params) {
                console.log(params);
                return h('div',
                  moment(params.row.createTime).format('YYYY-MM-DD HH:mm:ss'));
              }
            },
            {
              title: '操作',
              key: 'action',
              width: 180,
              align: 'center',
              render: (h, params) => {
                return h('div', [
                  h('Button', {
                    props: {
                      type: 'primary',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.show(params.index)
                      }
                    }
                  }, '查看'),
                  h('Button', {
                    props: {
                      type: 'primary',
                      size: 'small'
                    },
                    style: {
                      marginRight: '5px'
                    },
                    on: {
                      click: () => {
                        this.edit(params.index)
                      }
                    }
                  }, '修改'),
                  h('Button', {
                    props: {
                      type: 'error',
                      size: 'small'
                    },
                    on: {
                      click: () => {
                        this.remove(params.index)
                      }
                    }
                  }, '删除')
                ]);
              }
            }
          ],
          data: [

          ]
        }
      },
      methods:{
        add(){
          this.$router.push({
            name: 'add_stduent'
          });
        },
        init(){
          this.$http.get('/school/getAllStd').then(res => {
            this.data = res.data.data;
          });
        },
        show (index) {
          this.$Modal.confirm({
            title: '审核信息',
            content: `学生姓名：${this.data[index].stduentName}<br>
                      学生学号：${this.data[index].stduentNo}<br>
                      学生性别：${this.data[index].stduentSex}<br>
                      学生手机号：${this.data[index].stduentPhone}<br>
                      学生身份证：${this.data[index].stduentIdCard}<br>
                      学生所在班级：${this.data[index].stduentClass}<br>
                      学生所在院系：${this.data[index].stduentCollege}<br>
                      创建时间：${moment(this.data[index].createTime).format('YYYY-MM-DD HH:mm:ss')}`
          })
        },
        edit(index){
          this.$router.push({
            name: 'add_stduent',
            query:{id:this.data[index].id}
          });
        },
        remove (index) {
          this.$http.get('/school/delStd?id='+this.data[index].id).then(res =>{
            this.$Message.info('删除成功');
            this.data.splice(index, 1);
          });
        }
      },
      mounted(){
        this.init();
      }
    }
</script>

<style scoped>

</style>
